<div class="container">
  <p>You are logged in as <b>{{loggedInUserId}} </b> </p>
  <p>
    <a href='#/angieaddChannel/{{loggedInUserId}}'>Create a new channel</a>  
  </p>
  <p>
    List of available channels:
  </p>
  <ul>
    <li class='channels' ng-repeat='channel in channels.data | orderBy:"name"'>
      <h2>{{channel.name}}</h2>
        <a href='#/angiemain/{{loggedInUserId}}/{{channel.name}}'>
          {{channel.members.length}}
          <span ng-show='channel.members.length == 1'>member joined</span>
          <span ng-show='channel.members.length != 1'>members joined</span>
        </a>
        <button ng-click='joinChannel(channel.name)'>Join</button>
        </br>
        <span ng-show='channel.name == selectedChannelName'>{{channel.members}}</span>
       
      </p>
     
    </li>
</div>
</ul>
